<template>
  <div class="introduce_wrapper">
    <div class="banner" v-if="useWidth.width.value> 750" :style="{background:'url('+background.imageUrl+')  no-repeat center'}">
<!--      <div class="width">
        <h2>联系我们</h2>
      </div>-->
    </div>
    <div class="banner" v-if="useWidth.width.value  <= 750" :style="{background:'url('+background.imagePhone+')  no-repeat center'}">
<!--      <div class="width">
        <h2>联系我们</h2>
      </div>-->
    </div>
    <div class="breadcrumb">
      <div class="width">
        <div class="news_list_content_breadcrumb">
          <t-breadcrumb>
            <t-breadcrumb-item to="/dashboard/base"> 首页 </t-breadcrumb-item>
            <t-breadcrumb-item>联系我们</t-breadcrumb-item>
          </t-breadcrumb>
        </div>
      </div>
    </div>
    <div class="contactUs">
      <div class="width">
        <div class="contactTltle">
          <h3>我们期待与您联系</h3>
          <span>We look forward to contacting you</span>
        </div>
        <div class="contactUslist">
          <div class="contactUslistLeft">
            <div v-html="link_us"></div>
          </div>
          <div class="contactUslistRight">
            <div class="app">
              <BaiduMap
                :ak="yourAk"
                :center="{ lng: 116.184493, lat: 40.080566 }"
                :zoom="18"
              />
            </div>
          </div>
        </div>
      </div>
    </div>
    <footer class="copyright"></footer>
  </div>
</template>
<script lang="ts">
export default {
  name: "contactUs",
};
</script>
<script setup lang="ts">
import { ref } from "vue";
import BaiduMap from "./components/BaiduMap.vue";
import { backImage, contentConfig } from "@/api";
import { useWindowResize } from "@/utils/useWindowResize";

const yourAk = ref("xWJ1v0ApA7sPDhpJu11snN9GVhsGl0rZ"); // 替换为你的实际AK
const useWidth = useWindowResize();
const link_us = ref("");
contentConfig("link_us").then((e) => {
  link_us.value = e.content;
});

// 背景图片
const background = ref({ imagePhone: null, imageUrl: null });
backImage("link_us_background").then((e) => {
  background.value = e;
});
</script>

<style lang="less" scoped>
@import url("./index.less");
</style>
